<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>第九章:DOM基础</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />
  
</head>
<body>
    <div id="form">
        <h3>点击插入按钮，在页在中列出。</h3>
        <ul>
            <li>html</li>
            <li>css</li>
            <li id="insertPoint"> css在此之前插入点</li>
            <li>javascript</li>
        </ul>
        <input type="input"  name="keyword" id="keyword">
        <!-- <input type="radio" value="李四" name="keyword"> -->
        <input type="button" value="插入(父元素的子元素之后)" id="btn"/> 
        <input type="button" value="插入(父元素的子元素之前)" id="btn2"/>
        <input type="button" value="复制ul及li并插入下一行：" id="btn3"/>
        <input type="button" value="替换复制前后ul li：" id="btn4"/>
        <div id="cloneNode1">复制过来存放位置的div</div>

    </div>
    <div id="content1">
        content1
    </div>
    <div id="content2">
        content2
    </div>
    <div id="content3">
        content2，表格被插入table
    </div>
    <form>
        <ul>
            <li>
            爱好1:<input name="lover" type="radio"/>
            </li>            
            <li>
            爱好1:<input name="lover" type="radio"/>
            </li>

            <li>
            爱好1:<input name="lover" type="radio"/>
            </li>
        </ul>

    </form>
    <h3>新园三期房屋出售</h3>
    <ul id="house">
        <li>宿迁市</li>
        <li>宿城区</li>
        <li>面积:90平方</li> 
        <li>98万</li>
        <li>联系电话:15151150044</li> 
        <li>类型:出售</li>
    </ul>
    <p>
        房源描述，便民方舟南侧，体育馆西侧200米，小区地段好，
    </p>
    <div id="shuzu1" class="bg001"></div>
    <div id="shuzu2" class="bg001"></div>
</body>
</html>
<script src="js/main.js"></script>